---
title: Ikonok
image: /images/user-guide/objects/objects.png
---

<Frame>
  <img src="/images/user-guide/objects/objects.png" alt="Header" />
</Frame>

Az alkalmazásunkban használt ikonok listája.

## Tabler Ikonok

Az alkalmazásban React-hez Tabler ikonokat használunk.

<Tabs>

<Tab title="Installation"><br/>

```
yarn add @tabler/icons-react
```

</Tab>

<Tab title="Props">

Minden ikont komponensként importálhat. Here's an example: <br />

```jsx
import { IconArrowLeft } from "@tabler/icons-react";

export const MyComponent = () => {
  return <IconArrowLeft color="red" size={48} />;
};
```

</Tab>

<Tab title="Props">

| Tulajdonságok  | Típus  | Leírás                                   | Alapértelmezett |
| -------------- | ------ | ---------------------------------------- | --------------- |
| méret          | szám   | Az ikon magassága és szélessége pixelben | 24              |
| szín           | string | The color of the icons                   | currentColor    |
| vonalvastagság | szám   | Az ikon vonalvastagsága pixelben         | 2               |

</Tab>

</Tabs>

## Egyéni Ikonok

A Tabler ikonok mellett az alkalmazás egyedi ikonokat is használ.

### Ikon Címtár

Displays an address book icon.

<Tabs>

<Tab title="Usage">

```jsx
import { IconAddressBook } from 'twenty-ui/display';

export const MyComponent = () => {
  return <IconAddressBook size={24} stroke={2} />;
};
```

</Tab>

<Tab title="Props">

| Tulajdonságok  | Típus | Leírás                                   | Alapértelmezett |
| -------------- | ----- | ---------------------------------------- | --------------- |
| méret          | szám  | Az ikon magassága és szélessége pixelben | 24              |
| vonalvastagság | szám  | Az ikon vonalvastagsága pixelben         | 2               |

</Tab>

</Tabs>
